// 导入时间组件
import dayjs from 'dayjs'
// 导入表单校验组件
import Schema from 'validate'

const VisitValidate = new Schema(
  {
    //房间id
    houseId: {
      type: String, //数据类型
      required: true, //必填
      message: '房屋不能为空', //错误提示
    },
    //姓名
    name: {
      type: String, //数据类型
      required: true, //必填
      message: '姓名不能为空', // 错误提示
    },
    //手机号
    mobile: {
      type: String,
      required: true,
      match: /^1[3-9]\d{9}$/,
      message: '手机号格式不正确',
    },
    //访问日期
    visitDate: {
      type: String,
      required: true,
      message: '访问日期不能为空',
    },
  },
  {
    //默认清空下,所有未校验的字段都会被从对象中剥离，需要配置strip=false禁止该行为
    strip: false, //解决 验证对象后,数据丢失属性的问题
  }
)
Page({
  data: {
    // 获取当前时间戳有2种方法 1.new Date().getTime()  2.Date.now()
    currentDate: Date.now(), //日期组件当前日期 获取当前时间的时间戳
    // 在当前时间加3天有2种方法
    // 1.加上3天的时间戳
    // 2.利用dayjs插件
    // maxDate: Date.now() + 1000 * 60 * 60 * 24 * 3, //最大日期,根据接口可知，最大日期在当前日期加3天  访问日期:3天以内的日期
    maxDate: +dayjs().add(3, 'day'), //最大日期,根据接口可知，最大日期在当前日期加3天  访问日期:3天以内的日期
    dateLayerVisible: false,
    houseLayerVisible: false,
    houseList: [], //房屋列表
    houseId: '', //房屋信息id
    houseInfo: '', //房屋信息   因为获取回来的房屋详情字段中房屋名字为houseInfo，为了方便回填,所以我们起名就起houseInfo
    name: '', //姓名,
    gender: 1, //性别
    mobile: '', //手机号
    visitDate: '', //访问日期:当前日期往后3天
  },
  onLoad() {
    //调用获取房屋信息
    this.getHouseList()
  },
  //获取房屋信息
  async getHouseList() {
    const res = await wx.http({
      url: '/house',
    })
    console.log(res)
    // 把获取到的房屋列表设置给houseList
    this.setData({
      houseList: res.data,
    })
  },
  //选中房屋项处理
  selectHouse(e) {
    console.log('e  ----->  ', e)
    this.setData({
      houseId: e.detail.id,
      houseInfo: e.detail.name,
    })
  },
  //日期组件点击确认触发
  onDateConfirm(e) {
    console.log('e  ----->  ', e)
    console.log('e.detail  ----->  ', e.detail) //获取到的是时间戳需要转换为2012-12-03的格式
    this.setData({
      visitDate: dayjs(e.detail).format('YYYY-MM-DD'), //转换为2012-12-03的格式
      //关闭日期组件
      dateLayerVisible: false,
    })
  },
  //日期组件点击取消触发
  onDateCancel() {
    // 关闭日期组件
    this.setData({
      dateLayerVisible: false,
    })
  },

  //点击提交访客信息
  // 1.收集表单数据
  // 2.校验表单数据
  // 3.发送请求
  // 4.判断是否成功
  // 5.提示用户新增成功
  // 6.延迟跳转到访客列表页面
  async onSubmit() {
    const { houseId, name, gender, mobile, visitDate } = this.data
    const params = { houseId, name, gender, mobile, visitDate }

    const errors = VisitValidate.validate(params)
    console.log('errors  ----->  ', errors)
    if (errors.length) {
      // 记得return下面代码不再执行
      return wx.utils.toast(errors[0].message)
    }

    const res = await wx.http({
      url: '/visitor',
      method: 'POST',
      data: params,
    })
    console.log('res  ----->  ', res)

    if (res.code !== 10000) {
      return wx.utils.toast(res.message)
    }

    // 提示用户
    wx.showToast({
      title: '新增成功',
    })

    //跳转到访客列表页面
    setTimeout(() => {
      wx.navigateTo({ url: '/visitor_pkg/pages/list/index' })
    }, 1500)
  },
  //控制下拉框的显示隐藏
  openHouseLayer() {
    this.setData({ houseLayerVisible: true })
  },
  closeHouseLayer() {
    this.setData({ houseLayerVisible: false })
  },
  openDateLayer() {
    this.setData({ dateLayerVisible: true })
  },
  closeDateLayer() {
    this.setData({ dateLayerVisible: false })
  },
  goPassport() {
    wx.reLaunch({
      url: '/visitor_pkg/pages/passport/index',
    })
  },
})
